<template>
	<div>
		<div style="width: 100%;height: 20px;background-color: #ebedf0;"></div>
		<div style="position: relative;padding: 20px;">
			<Spin size="large" fix v-if="loadingshow"></Spin>
			<!--<Row style="margin-top:15px">
		        <Col span="24" style="text-align: left;">
		        	<span>请选所属年级：</span>
		            <RadioGroup v-model="grade" type="button" @on-change="changeselect">
		        		<Radio v-for="item in gradelist" :key="item.value" :label="item.value">{{item.label}}</Radio>
				        
				    </RadioGroup>
		        </Col>
		    </Row>
		    <Row v-if="grade" style="margin-top:15px">
			    <Col span="24" style="text-align: left;">
			    	<span style="font-size: 16px;">学年：</span>
		            <Select placeholder="请选择学年" v-model="schoolYearStart" style="width:100px;text-align: center;" >
				        <Option v-for="item in schoolYearStartList" :value="item.value" :key="item.value">{{ item.label }}</Option>
				    </Select>
				    <span style="font-size: 16px;">-</span>
				   	<Input style="width: 100px;text-align: center;" disabled :value='parseInt(schoolYearStart)+1' placeholder=""  />
				   
			    </Col>
			</Row>
			<Row style="margin-top:15px">
		        <Col span="8" style="text-align: left;">
		        	<span style="font-size: 16px;">上传基数成绩：</span>
		        	<Button type="ghost" :loading="loading" @click="getdownload" >
				        <span v-if="!loading">本次学生模板下载</span>
				        <span v-else>加载中</span>
				    </Button>
		        </Col>
		    </Row>
		    <Row style="margin-top:15px">
		        <Col span="24" style="text-align: left;">
		        	<span>输入名称：</span>
					<Input v-model="inputname" placeholder="请输入名称" style="width:200px">
				    </Input>
		        </Col>
		    </Row>
			
		    <Row>
		       <Col span="12" style="text-align: right;margin-top:15px;font-size: 16px;">
		        	<Upload
				        multiple
				        ref="upload"
				        :before-upload="handleUpload"
				        :on-success="uploadSuccess"
				        name="file"
				        type="drag"
				        :show-upload-list="false"
				        :headers="headers"
				        :data="senddata"
				        :action="actionUrl">
				        <div style="padding: 20px 0">
				            <Icon type="ios-cloud-upload" size="52" style="color: #3399ff"></Icon>
				            <p>点击或者拖拽文件到此处</p>
				        </div>
				    </Upload>
		        </Col>
		      
		    </Row>
		    <Row>
		       <Col span="12" style="text-align: left;margin-top:15px;font-size: 16px;">
				    <div v-for="(item, index) in file">文件: {{ item.name }} 
				        <Button @click="delectFile(item.keyID)" type="error" size="small" shape="circle" icon="close-round"></Button>
				        <Button style="margin-left:30px;"  v-if="index === 0" type="primary" @click="upload" >上传</Button>
				    </div>
				</Col>
		    </Row>-->
		    <Row style="margin-top:30px">
		        <Col span="12" style="text-align: left;">
		        	<span style="font-size: 16px;">已上传本次成绩列表：</span>
		        </Col>
		        <Col span="12" style="text-align: right;font-size: 16px;">
		        	<Button @click="downfile" type="success" size="small"><i class="iconfont alicon-down_light"></i></Button>
		        	<Button @click="dellist" type="error" size="small"><i class="iconfont alicon-delete"></i></Button>
		        </Col> 
		    </Row>
		    <div style="position: relative;">
		    	<Table style="margin-top: 10px;" border ref="selection" :columns="columns4" :data="data1" @on-selection-change="listselect"></Table>
		    	<Spin size="large" fix v-if="cardinallistshow"></Spin>
		    </div>
		</div>
	</div>
</template>

<script>
	import api from "@/components/js/Apidomain.js"
	import { getsessionstorage } from '@/components/js/Localstorage'
	
	export default{
		data(){
			return{
				loading: false,				//下载模板按钮上的加载中显示隐藏
				loadingshow:false,			//页面全局加载中显示隐藏
				cardinallistshow:false,		//已上传基数列表的加载中显示隐藏
				inputname:"",						//输入的名称
				grade:"",							//选择的年级
				selections:"",							//勾选表的集合
				
				schoolYearStart:"",					//学年
				schoolYearStartList:[],				//学年列表
//				schoolYearStartNext:"",				//学年自动加1
				
				file:[],
				uploadFile: [],
				actionUrl:"",
				headers: {
				    'Authorization' : ''
				},
				senddata:{
					gradeId:"",									//年级ID
					examName:"", 								//输入的名字
					isBase:0, 									//是否为基数考试（是为1，否为0）
					isThis:1,										//是否为本次考试（是为1，否为0）
					
					schoolYearStart:"",							//学年开始
					schoolYearEnd:"",
				},
				
				gradelist: [
//					{value: '2',label: '初一年级'},
//                  {value: '3',label: '初二年级'},
//                  {value: '4',label: '初三年级'},
//                  {value: '5',label: '高一年级'},
//                  {value: '6',label: '高二年级'},
//                  {value: '7',label: '高三年级'},  
                ],
                columns4: [
                    {type: 'selection',width: 60,align: 'center'},
                    {title: '所属年段',key: 'gradeName',align: 'center',},
                    {title: '名称',key: 'examName',align: 'center',},
                    {title: '学年',key: 'year',align: 'center',},
                    {title: '导入者',key: 'createUser',align: 'center',},
                ],
                data1: [
//                  {id:"4444",gradeName:"高一",examName: '2018年期中考试',createUser: '管理员'},
//                  {id:"4234",gradeName:"高一",examName: '2018年期中考试',createUser: '管理员'},
//                  {id:"42244",gradeName:"高一",examName: '2018年期中考试',createUser: '管理员'},
//                  {id:"4444444",gradeName:"高一",examName: '2018年期中考试',createUser: '管理员'}
                ]
			}
		},
		created(){
			this.getgradelist()
			this.getcardinallist();
			
		},
		methods:{
			getSchoolYear:function(){
//         		this.gradelistshow = true;
           		var self = this;
            	let url = api.apidomain+'/tqes/web/tchExam/getSchoolYearStart/'+this.grade;
            	this.$http.post(url, {}).then(function(response) {
					if(response.data.success == true){
						
//						////console.log(response.data.data)
					
						self.schoolYearStartList = response.data.data
		            }else if(response.data.success == false){
		            		self.$Message.error({
								content: response.data.msg,
								duration: 10,
								closable: true
							});	
//		            		self.gradelistshow = false;
		            	}
					})
					.catch(function(error) {
						self.$Message.error({
							content: '系统发生错误：错误码00107',
							duration: 10,
							closable: true
						});
						self.gradelistshow = false;
					});
           	},
			changeselect:function(value){
				this.getSchoolYear()
			},
			listselect:function(selection){
           		this.selections = selection
           	},
           	downfile:function(){
           		if(this.selections.length != 1){
           			this.$Message.error({
								content: '请勾选一条信息',
								duration: 10,
								closable: true
							});	
           			return;
           		}
//         		//console.log(this.selections[0].id)
           		this.loadingshow = true;
				var self = this;
            	let url = api.apidomain+'/tqes/web/tchExam/exportExamListExcel';
            	this.$http.post(url,{examId:this.selections[0].id}).then(function(response) {
					if(response.data.success == true){
//						////console.log(response.data.data)
						window.location.href = response.data.data;
						self.loadingshow = false;
	            }else if(response.data.success == false){
	            		self.loadingshow = false;
	            		self.$Message.error({
								content: response.data.msg,
								duration: 10,
								closable: true
							});	
	            	}
	            	
				})
				.catch(function(error) {
					self.loadingshow = false;
					self.$Message.error({
							content: '系统发生错误：错误码00108',
							duration: 10,
							closable: true
						});
				});
           	},
           	dellist:function(){
           		let delallid = [];
           		for(let key in this.selections){
           			delallid.push(this.selections[key].id)
           		}
           		if(delallid.length == 0){
           			this.$Message.error({
								content: '请勾选再删除',
								duration: 10,
								closable: true
							});
           			return;
           		}
           		
           		this.$Modal.confirm({
                    title: '确定删除',
                    content: '<p>确定删除这些本次信息吗</p>',
                    onOk: () => {
		               this.cardinallistshow = true;
		           		var self = this;
		            	let url = api.apidomain+'/tqes/web/tchExam/batchDeleteExamInfo';
		            	this.$http.post(url, {'ids':delallid}).then(function(response) {
							if(response.data.success == true){
								self.$Message.success({
				                    content: '删除成功',
				                    duration: 10,
				                    closable: true
		               			})
		//						////console.log(response.data.data)
								self.cardinallistshow = false;
								self.getcardinallist();
								self.selections = [];
				            }else if(response.data.success == false){
				            		self.$Message.error({
										content: response.data.msg,
										duration: 10,
										closable: true
									});
				            		self.cardinallistshow = false;
				            	}
							})
							.catch(function(error) {
								self.$Message.error({
									content: '系统发生错误：错误码00109',
									duration: 10,
									closable: true
								});
								self.cardinallistshow = false;
							}); 
		                
                    },
                    onCancel: () => {
//                      this.$Message.info('Clicked cancel');
                    }
                });	
           	},
           	//获取年级选择列表
           	getgradelist:function(){
           		this.gradelistshow = true;
           		var self = this;
            	let url = api.apidomain+'/tqes/web/tchStudent/getTchGradeSelect';
            	this.$http.post(url, {}).then(function(response) {
					if(response.data.success == true){
						
//						////console.log(response.data.data)
						self.gradelist = response.data.data
						self.gradelistshow = false;
		            }else if(response.data.success == false){
		            		self.$Message.error({
								content: response.data.msg,
								duration: 10,
								closable: true
							});
		            		self.gradelistshow = false;
		            	}
					})
					.catch(function(error) {
						self.$Message.error({
							content: '系统发生错误：错误码00110',
							duration: 10,
							closable: true
						});
						self.gradelistshow = false;
					});
           	},
           	getcardinallist:function(){
           		this.cardinallistshow = true;
           		var self = this;
            	let url = api.apidomain+'/tqes/web/tchExam/getImportedExam';
            	this.$http.post(url, {"type": "High","isBase":"0","isThis":"1"}).then(function(response) {
					if(response.data.success == true){
						
//						////console.log(response.data.data)
						self.data1 = response.data.data
						self.cardinallistshow = false;
		            }else if(response.data.success == false){
		            		self.$Message.error({
								content: response.data.msg,
								duration: 10,
								closable: true
							});	
		            		self.cardinallistshow = false;
		            	}
					})
					.catch(function(error) {
						self.$Message.error({
							content: '系统发生错误：错误码00111',
							duration: 10,
							closable: true
						});
						self.cardinallistshow = false;
					});
           	},
           	getdownload:function(){
           		if(this.grade == "" ){
					this.$Message.error({
								content: '请先选择年级在下载',
								duration: 10,
								closable: true
							});	
					return;
				}
           		var senddata = {
           			gradeId:this.grade, 
					isBase:0,
					isThis:1,
           		}
				this.loading = true;
				var self = this;
            	let url = api.apidomain+'/tqes/web/tchExam/exportExamStudentListExcel';
            	this.$http.post(url,senddata).then(function(response) {
					if(response.data.success == true){
//						////console.log(response.data.data)
						window.location.href = response.data.data;
						self.loading = false;
	            }else if(response.data.success == false){
	            		self.loading = false;
	            		self.$Message.error({
								content: response.data.msg,
								duration: 10,
								closable: true
							});	
	            	}
	            	
				})
				.catch(function(error) {
					self.loading = false;
					self.$Message.error({
							content: '系统发生错误：错误码00112',
							duration: 10,
							closable: true
						});
				});
			},
			handleUpload (file) { // 上传文件前的事件钩子
//				if(this.grade == "" ){
//					this.$Message.error('请先选择年级信息');
//					return;
//				}
				
				let filename = file.name;
				let cutfilename = filename.slice(0,filename.lastIndexOf('.'))
				this.inputname = cutfilename
				
				this.actionUrl = api.apidomain + '/tqes/web/tchExam/upLoadExamExcel';
				let token = getsessionstorage("authorization");
				this.headers.Authorization = token;
				this.senddata.gradeId = this.grade;
				this.senddata.examName = this.inputname;
				this.senddata.schoolYearStart = this.schoolYearStart;
				this.senddata.schoolYearEnd = parseInt(this.schoolYearStart)+1;
//				//console.log(this.senddata)
				
				
			    // 选择文件后 这里判断文件类型 保存文件 自定义一个keyid 值 方便后面删除操作
			    let keyID = Math.random().toString().substr(2);
			    file['keyID'] = keyID;
			    // 保存文件到总展示文件数据里
			    this.file.push(file);
			    // 保存文件到需要上传的文件数组里
			    this.uploadFile.push(file)
			    // 返回 falsa 停止自动上传 我们需要手动上传
			    return false;
			},
			delectFile (keyID) { // 删除文件
//				//console.log(keyID);
			    // 删除总展示文件里的当前文件
			    this.file = this.file.filter(item => {
                    return item.keyID != keyID
                })
                this.uploadFile = this.uploadFile.filter(item => {
                    return item.keyID != keyID
                })
			},
			upload () { // 上传文件
				this.loadingshow = true;
			    for (let i = 0; i < this.uploadFile.length; i++) {
			        let item = this.file[i]
			        this.$refs.upload.post(item);
			    }
			},
			uploadSuccess (res, file,fileList) { // 文件上传回调 上传成功后删除待上传文件
				if(res.success == true){
						this.loadingshow = false;
						this.$Message.success({
		                    content: '上传成功',
		                    duration: 10,
		                    closable: true
               			})
						this.file = [];
						this.uploadFile = [];
	            }
				if(res.success == false){
						this.loadingshow = false;
						this.$Message.error({
								content: res.msg,
								duration: 10,
								closable: true
							});	
						this.file = [];
						this.uploadFile = [];
	            }
				this.getcardinallist();
			},
		}
	}
</script>

<style>
	.ivu-input-wrapper>input{
		text-align: center;
	}
</style>